import React, { useCallback } from 'react';
import { Radio } from 'antd';
import type { RadioChangeEvent } from 'antd';

interface SerialStopBitsViewProps {
  value?: string;
  onChange?: (value: string) => void;
}

const options = [
  { label: '1', value: '1' },
  { label: '1.5', value: '1.5' },
  { label: '2', value: '2' },
];

const SerialStopBitsView: React.FC<SerialStopBitsViewProps> = ({
  value,
  onChange,
}) => {
  const handleChange = useCallback(
    (e: RadioChangeEvent) => onChange?.(e.target.value),
    [onChange]
  );

  return (
    <Radio.Group
      value={value}
      onChange={handleChange}
      optionType="button"
      buttonStyle="solid"
      options={options}
    />
  );
};

export default SerialStopBitsView;
